import React, { Component } from 'react';

//正在热映
import Hot from './Hot';
//即将上映
import Watch from './Watch';

import { CartoonStyle } from './CartoonStyle'
import { Route, NavLink, Redirect, Switch, withRouter } from 'react-router-dom'

// import Searc from '../Search/Search'

class Cartoon extends Component {
    render() {
        // 父组件url
        let pathname = this.props.match.path
        return (
            <>
                <CartoonStyle>
                    <p className="iconfont icon-shoubing"></p>
                    <div>
                        <NavLink to={`${pathname}/hot`}>
                            <span>热门</span>
                        </NavLink>
                        <NavLink to={`${pathname}/watch`}>
                            <span>书架</span>
                        </NavLink>
                    </div>
                    <div>
                    <p className="iconfont icon-miaobiao"></p>
                    <p onClick={this.Serc.bind(this)} className="iconfont icon-sousuozhengchangzhuangtai"></p>
                    </div>
                </CartoonStyle>
                    <Route path={`${pathname}/watch`} children={route=><Watch {...route}/>} />
                    <Route path={`${pathname}/hot`} children={route=><Hot {...route}/>} />
                {/* 重定向 */}
                <Redirect from='/' to={`${pathname}/hot`} />

            </>
        );
    }
    Serc(){
        this.props.history.push('/search')
    }
}

export default Cartoon;
